<template>
	<view style="height: 100%;">
		<cu-custom :isBack="true" leftIcon="edit" :showLeftIcon="showCreateBtn" @leftBtnClick="createTopicAction">
			<block slot="backText">返回</block>
			<block slot="content">{{chooseMode?'选择话题':'话题热点'}}</block>
		</cu-custom>
		<mescroll-body ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback" :up="upOption">
			<view v-for="(item,index) in dataList" :key="index">
				<topic-item @tap="jumpToDetail(item)" @attention="attentionAction(item,index)" @clickOwner="jumpToUserProfile(item.owner_id)" @chooseTopicAction="chooseTopicAction(item)" :topic="item" :chooseMode="chooseMode"></topic-item>
			</view>
		</mescroll-body>
	</view>
</template>

<script>
	import TopicItem from '@/components/topic-item.vue'
	import {
		getTimeDistance
	} from '@/api/utils.js'
	import {
		getTopicList,
		attentionTopic
	} from '@/api/api.js'
	import {
		checkLogin
	} from '@/js_sdk/checkLogin.js'
	import {
		isLogin,
		getUserInfo
	} from '@/api/auth.js'
	import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
	import config from '@/api/config.js'
	export default {
		components: {
			TopicItem
		},
		name:"TopicList",
		mixins: [MescrollMixin],
		data() {
			return {
				appSetting:this.AppSetting,
				themeColor:this.ThemeColor,
				chooseMode:true,
				keyword:null,
				dataList: [],
				upOption: {
					page: {
						size: 10 // 每页数据的数量,默认10
					},
					textNoMore: config.customNoMore,
					noMoreSize: 1, // 配置列表的总数量要大于等于5条才显示'-- END --'的提示
					empty: {
						tip: '暂无相关数据'
					}
				},
			}
		},
		computed: {
			showCreateBtn() {
				 if (this.appSetting.enable_user_create_topic == 1) {
					return true
				 }
				 let userInfo = getUserInfo()
				 if (userInfo.role == null) {
				 	return false
				 }
				 return userInfo.role_id == 1
			}
		},
		onLoad(options) {
			if(options.mode !== null && options.mode !== undefined) {
				if(options.mode == 'show') {
					this.chooseMode = false
				}
			}
		},
		methods: {
			jumpToDetail(topic) 
			{
				uni.navigateTo({
					url:'/pages/always/topic-post-list/topic-post-list?topicId='+topic.topic_id
				})
			},
			attentionAction(item,index) 
			{
				if(isLogin() == false) {
					checkLogin()
					return
				}
				uni.showLoading({
					title:'正在提交...'
				})
				let status = item.is_attention == 0? 1:0
				attentionTopic(item.topic_id,status).then(res=>{
					uni.hideLoading()
					this.dataList[index].is_attention = status
					let tip = status == 1? '已关注':'已取消'
					uni.showToast({
						title:tip
					})
				}).catch(error=>{
					uni.hideLoading()
				})
			},
			chooseTopicAction(item) 
			{
				const eventChannel = this.getOpenerEventChannel()
				eventChannel.emit('finishChoose', item);
				uni.navigateBack({
					delta:1
				})
			},
			createTopicAction() 
			{
				uni.navigateTo({
					url:'/pages/always/create-topic/create-topic'
				})
			},
			jumpToUserProfile(userId) 
			{
				uni.navigateTo({
					url: '/pages/profile/profile?userId=' + userId
				})
			},
			getDataList(pageIndex, pageSize) {
				getTopicList(this.keyword, pageIndex, pageSize).then(res => {
					res.data.list.forEach(item => {
						item.show_time = getTimeDistance(item.last_message_time)
					})
					let pageList = res.data.list
					if (pageIndex == 0) {
						this.dataList = pageList
					} else {
						this.dataList = this.dataList.concat(pageList)
					}
					let hasNext = pageList.length >= pageSize
					if (this.mescroll) {
						this.mescroll.endSuccess(this.dataList.length, hasNext);
					}
				}).catch(error => {
					if (this.mescroll) {
						this.mescroll.endErr()
					}
				})
			},
			downCallback() {
				if (this.mescroll) {
					this.mescroll.resetUpScroll()
				}
			},
			upCallback(page) {
				let pageIndex = page.num - 1
				this.getDataList(pageIndex, page.size)
			}
		}
	}
</script>

<style>
</style>
